{% extends "base.html" %}

{% block title %}帮助{% endblock %}

{% block content %}
<div class="row">
    <div class="col-lg-10 mx-auto">
        <h2 class="mb-4"><i class="fas fa-question-circle text-primary"></i> 常见问题 FAQ</h2>
        
        <div class="alert alert-info">
            <i class="fas fa-info-circle"></i> 
            <strong>提示：</strong>如需查看详细使用说明，请访问<a href="{{ url_for('main.about') }}" class="alert-link">关于页面</a>。
        </div>

        <div class="accordion" id="faqAccordion">
            <!-- 通用问题 -->
            <div class="accordion-item">
                <h2 class="accordion-header">
                    <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#faq1">
                        <i class="fas fa-globe me-2"></i> 通用问题
                    </button>
                </h2>
                <div id="faq1" class="accordion-collapse collapse show" data-bs-parent="#faqAccordion">
                    <div class="accordion-body">
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 这个工具箱需要安装吗？</h6>
                            <p class="mb-0">不需要。这是一个基于Web的应用，只需在浏览器中访问即可使用，无需安装任何客户端软件。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 支持哪些浏览器？</h6>
                            <p class="mb-0">推荐使用Chrome、Edge、Firefox等现代浏览器的最新版本，以获得最佳体验。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 上传的文件会被保存吗？</h6>
                            <p class="mb-0">上传的文件会临时保存在服务器上用于处理，处理完成后建议及时下载结果文件。系统会定期清理临时文件。</p>
                        </div>
                        
                        <div>
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 文件大小有限制吗？</h6>
                            <p class="mb-0">单个文件建议不超过1024MB，以保证处理速度。</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Excel导出测试文档问题 -->
            <div class="accordion-item">
                <h2 class="accordion-header">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq2">
                        <i class="fas fa-file-export me-2"></i> Excel导出测试文档
                    </button>
                </h2>
                <div id="faq2" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                    <div class="accordion-body">
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 为什么导出失败提示找不到模板？</h6>
                            <p class="mb-0">需要确保在 <code>templates/word_templates/test_template.docx</code> 路径下存放了Word模板文件。请联系管理员配置模板。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 如何正确填写列号？</h6>
                            <p class="mb-0">列号使用Excel中的字母表示，例如第一列是A，第二列是B，第26列是Z，第27列是AA。系统会自动识别并转换。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 斜杠"/"的作用是什么？</h6>
                            <p class="mb-0">在Excel表格中，使用斜杠（/ 或 \）表示该单元格继承上一行的值，这样可以避免重复输入相同的标题内容。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 最多支持多少层级标题？</h6>
                            <p class="mb-0">目前支持最多9个层级的标题（对应Excel的A到I列），可以满足大多数复杂文档的需求。</p>
                        </div>
                        
                        <div>
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 导出的Word文档格式可以自定义吗？</h6>
                            <p class="mb-0">可以。通过修改 <code>test_template.docx</code> 模板文件，可以自定义表格样式、字体、颜色等格式，导出时会保留模板的格式设置。</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 文档批量替换问题 -->
            <div class="accordion-item">
                <h2 class="accordion-header">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq3">
                        <i class="fas fa-edit me-2"></i> 文档批量替换
                    </button>
                </h2>
                <div id="faq3" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                    <div class="accordion-body">
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 支持哪些文件格式？</h6>
                            <p class="mb-0">目前只支持Word文档（.docx格式）。上传其他格式的文件会被自动忽略。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 原文件会被修改吗？</h6>
                            <p class="mb-0">不会。系统会创建文件副本进行处理，原文件保持不变。处理后的文件会保存在独立的批次目录中。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 批量替换规则文件的格式要求？</h6>
                            <p class="mb-0">规则文件必须是.txt格式，每行一条规则，格式为"查找内容:替换内容"。支持#号开头的注释行和空行。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 替换内容中可以包含冒号吗？</h6>
                            <p class="mb-0">可以。系统会将第一个冒号作为分隔符，后面的所有内容（包括冒号）都会被识别为替换内容。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 多条规则是如何执行的？</h6>
                            <p class="mb-0">规则按照文件中的顺序依次执行。后面的规则会在前面规则的结果上继续替换，因此规则的顺序可能会影响最终结果。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 可以替换页眉页脚的内容吗？</h6>
                            <p class="mb-0">可以。v2.0版本已经支持对Word文档的页眉、页脚（包括其中的表格）进行替换。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 上传文件夹后目录结构会保留吗？</h6>
                            <p class="mb-0">会的。系统会保持原有的文件夹结构，处理后的文件也会按照相同的目录结构存放。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 什么是"批次ID"？</h6>
                            <p class="mb-0">每次上传文件时系统会生成唯一的批次ID，用于隔离不同批次的文件，防止文件混淆。您可以通过批次ID下载对应的处理结果。</p>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 正则表达式怎么使用？</h6>
                            <p>勾选"使用正则表达式"选项后，可以在查找内容中使用正则表达式进行高级匹配。例如：</p>
                            <ul class="mb-0">
                                <li><code>\d+</code> - 匹配一个或多个数字</li>
                                <li><code>[a-z]+</code> - 匹配一个或多个小写字母</li>
                                <li><code>^\w+</code> - 匹配行首的单词</li>
                            </ul>
                        </div>
                        
                        <div>
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 如何下载全部处理后的文件？</h6>
                            <p class="mb-0">处理完成后，点击"批量下载 ZIP"按钮，系统会将所有处理后的文件打包成一个ZIP压缩包供您下载。</p>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 技术支持 -->
            <div class="accordion-item">
                <h2 class="accordion-header">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#faq4">
                        <i class="fas fa-life-ring me-2"></i> 技术支持
                    </button>
                </h2>
                <div id="faq4" class="accordion-collapse collapse" data-bs-parent="#faqAccordion">
                    <div class="accordion-body">
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 遇到错误怎么办？</h6>
                            <p>请先尝试以下操作：</p>
                            <ol class="mb-0">
                                <li>刷新页面重试</li>
                                <li>检查文件格式是否正确</li>
                                <li>确认文件大小是否在限制范围内</li>
                                <li>如果问题依然存在，请联系开发者并提供详细的错误信息</li>
                            </ol>
                        </div>
                        
                        <div class="mb-4">
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 如何反馈建议或报告Bug？</h6>
                            <p class="mb-0">欢迎通过微信联系开发者（小李，微信号：wujie122511），提供详细的使用场景和问题描述。</p>
                        </div>
                        
                        <div>
                            <h6 class="text-primary"><i class="fas fa-question-circle"></i> 是否支持定制开发？</h6>
                            <p class="mb-0">如果您有特殊的需求或希望添加新功能，可以联系开发者讨论定制开发的可能性。</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 联系卡片 -->
        <div class="card mt-4 border-primary">
            <div class="card-header bg-primary text-white">
                <h5 class="mb-0"><i class="fas fa-phone-alt"></i> 还有其他问题？</h5>
            </div>
            <div class="card-body">
                <p class="card-text">
                    如果以上FAQ没有解决您的问题，欢迎直接联系开发者。
                </p>
                <div class="row g-3">
                    <div class="col-md-6">
                        <div class="d-flex align-items-center p-3 bg-light rounded">
                            <i class="fas fa-user fa-2x text-primary me-3"></i>
                            <div>
                                <small class="text-muted d-block">开发者</small>
                                <strong class="fs-5">{{ developer_name }}</strong>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="d-flex align-items-center p-3 bg-light rounded">
                            <i class="fab fa-weixin fa-2x text-success me-3"></i>
                            <div>
                                <small class="text-muted d-block">微信号</small>
                                <strong class="fs-5"><code>{{ developer_wechat }}</code></strong>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- 快速链接 -->
        <div class="card mt-3">
            <div class="card-body">
                <h5 class="card-title"><i class="fas fa-link"></i> 快速链接</h5>
                <div class="d-flex flex-wrap gap-2">
                    <a href="{{ url_for('main.index') }}" class="btn btn-outline-primary">
                        <i class="fas fa-home"></i> 返回首页
                    </a>
                    <a href="{{ url_for('main.about') }}" class="btn btn-outline-success">
                        <i class="fas fa-book"></i> 查看详细说明
                    </a>
                    <a href="{{ url_for('tools.excel_to_word') }}" class="btn btn-outline-info">
                        <i class="fas fa-file-export"></i> Excel导出工具
                    </a>
                    <a href="{{ url_for('tools.doc_replace') }}" class="btn btn-outline-warning">
                        <i class="fas fa-edit"></i> 批量替换工具
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}

